<template>
  <div class="bbq-radio-box">
    <slot></slot>
  </div>
</template>

<script lang="ts">
import {provide,reactive,toRefs,defineComponent} from 'vue'
export default defineComponent({
  name: "bbq-radio-box",
  props:{
    modelValue: {
      type: [String,Number,Boolean],
      default: ""
    }
  },
  emits:['update:modelValue'],
  setup(props,ctx){

    //对组件外部的值发生变化
    const changeEvent = function (value: string|number|boolean) {
      ctx.emit('update:modelValue', value)
    }

    provide("radioGroup", reactive({
      ...toRefs(props),
      changeEvent: changeEvent,
    }))

    return {

    }
  }
})
</script>